import React, { useImperativeHandle, forwardRef, useRef, useState, useEffect } from 'react'
import { Form, Input, Select, Switch } from 'antd'
import ArbitratorSelector from './ArbitratorSelector'
import { emailPattern } from '@js/config'
const { Item } = Form
const { TextArea } = Input
const { Option } = Select

// formRef, caseDetail, data, theme, addressList, contractList, setContractList, currentAddressList, setCurrentAddressList
function Main ({ formRef, pState, pDispatch }, ref) {
  const subjectRef = useRef(null)
  const [types, setTypes] = useState([])
  useEffect(() => {
    setTypes(pState.dictionaries['送达地址类型'] || [])
  }, [pState.dictionaries])
  useImperativeHandle(ref, () => ({
    changeSubject: (type, formRef, caseDetail, data, dispatch) => {
      subjectRef.current.changeSubject(type, formRef, caseDetail, data, dispatch)
    }
  }))
  return (
    <>
      <Item name='status' noStyle><span /></Item>
      <Item name='contract_type' noStyle><span /></Item>
      <Item name='id' noStyle><span /></Item>
      <ArbitratorSelector pState={pState} formRef={formRef} />
      <Item name='contract' label='收件人'>
        <Input disabled />
      </Item>
      <Item name='mobile' label='移动电话' rules={[{ required: true, message: '移动电话不能为空' }, { pattern: /^1\d{10}(,1\d{10})*$/g, message: '移动电话格式不正确，多个移动电话请以英文逗号隔开' }]}>
        <Input placeholder='请输入移动电话' />
      </Item>
      <Item name='email' label='邮箱' rules={[{ pattern: emailPattern, message: '电子邮箱格式不正确，多个电子邮箱请以英文逗号隔开' }]}>
        <Input placeholder='请输入邮箱' />
      </Item>
      <Item name='type' label='地址类型' rules={[{ required: true, message: '地址类型不能为空' }]}>
        <Select placeholder='请选择地址类型'>
          {
            types.map(li => {
              return <Option key={li.title} value={li.title}>{li.title}</Option>
            })
          }
        </Select>
      </Item>
      {/* <Item name='sms_content' label='送达短信' rules={[{ required: true, message: '请输入送达短信' }]}>
        <TextArea rows={3} placeholder='请输入送达短信' />
      </Item> */}
      <Item name='email_content' label='送达邮件'>
        <TextArea rows={3} placeholder='请输入送达邮件' />
      </Item>
      <Item name='documentid' label='送达材料'>
        <Select mode='multiple' placeholder='请选择送达材料' allowClear>
          {pState.files.map(li => {
            return (
              <Option key={li.id} value={li.id}>{li.title}</Option>
            )
          })}
        </Select>
      </Item>
      <Item name='remark' label='备注'>
        <TextArea rows={3} placeholder='请输入备注' />
      </Item>
      <Item name='islast_known_place' label='是否为最后一个为人所知的地址' labelCol={{}} valuePropName='checked'>
        <Switch checkedChildren='是' unCheckedChildren='否' />
      </Item>
    </>
  )
}

export default forwardRef(Main)
